<template>
  <div style="margin-top:-18px">
    <a-card :bordered="false">
      <div class="table-page-search-wrapper">
        <a-form layout="inline" class="formModel" style="margin:20px 0 0 20px">
          <a-row :gutter="48">
            <a-col :md="4" :sm="24">
              <a-form-item label="项目名称">
                <a-input v-model="queryParam.projectName" placeholder="" />
              </a-form-item>
            </a-col>
            <a-col :md="4" :sm="24">
              <a-form-item label="区县">
                <a-select v-model="queryParam.country" placeholder="请选择区县" :disabled="disabled">
                  <a-select-option value="">全部</a-select-option>
                  <a-select-option value="鼓楼">鼓楼</a-select-option>
                  <a-select-option value="马尾">马尾</a-select-option>
                  <a-select-option value="台江">台江</a-select-option>
                  <a-select-option value="晋安">晋安</a-select-option>
                  <a-select-option value="仓山">仓山</a-select-option>
                  <a-select-option value="长乐">长乐</a-select-option>
                  <a-select-option value="福清">福清</a-select-option>
                  <a-select-option value="闽侯">闽侯</a-select-option>
                  <a-select-option value="罗源">罗源</a-select-option>
                  <a-select-option value="闽清">闽清</a-select-option>
                  <a-select-option value="连江">连江</a-select-option>
                  <a-select-option value="平潭">平潭</a-select-option>
                  <a-select-option value="永泰">永泰</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="4" :sm="24">
              <a-form-item label="客户名称">
                <a-input v-model="queryParam.customer" />
              </a-form-item>
            </a-col>
            <a-col :md="4" :sm="24">
              <a-form-item label="IP地址">
                <a-input v-model="queryParam.lineIp" />
              </a-form-item>
            </a-col>
            <a-col :md="4" :sm="24">
              <a-form-item label="资管编号">
                <a-input v-model="queryParam.number" />
              </a-form-item>
            </a-col>
            <a-col :md="4" :sm="24">
              <span>
                <a-button type="primary" @click="queryEvent">查询</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <a-table style="margin: 0 20px 20px 20px" @change="pageShow" :loading="tableLoading" :columns="columnstable" :data-source="data" bordered size="middle" :pagination="pagination">
        <template slot="action" slot-scope="text, record">
          <a @click="dwexamineEvent(record)">手动</a>
          <a-divider type="vertical" />
          <a @click="modifyEvent(record)">编辑</a>
          <a-divider type="vertical" />
          <a @click="quxiaoEvent(record.id)">删除</a>
        </template>

      </a-table>
      <!-- //编辑资源  -->
      <Modify v-if="modifyShow"  @cancelEvent="cancelEvent" :newform="newform" @updateMsg="updateMsg" ></Modify>
    </a-card>
  </div>
</template>

<script>
import Vue from 'vue'
import moment from 'moment'
import { ACCESS_TOKEN, ROLE_NAME, USERINFO } from '@/store/mutation-types'
import { getStandardVideoList, deleteVideo ,modifyVideoStatus,modifyVideo} from '@/api/video'
import { getUserRightAction } from '@/utils/util'
import Modify from '@/views/videoManage/maintenanceResources/resources/modify'
const data = []
export default {
  components: { Modify },
  data() {
    return {
      modifyInfo:'',
      disabled: false,
      columnstable,
      data,
      newform: {},
      modifyShow: false,
      searchData: [],
      // create model
      visible: false,
      confirmLoading: false,
      mdl: null,
      // 高级搜索 展开/关闭
      advanced: false,
      // 查询参数
      queryParam: {},
      // 加载数据方法 必须为 Promise 对象
      selectedRowKeys: [],
      selectedRows: [],
      tableLoading: false,
      pagination: {
        total: 0,
        showTotal: (total) => `共有 ${total} 条数据`,
      },
      current: 1,
      pageSize: 10,
    }
  },
  filters: {},
  created() {
    let country = getUserRightAction()[0]
    country.length == 0 ? (this.disabled = false) : ((this.queryParam.country = country), (this.disabled = true))
    this.queryParam.current = this.current
    this.queryParam.pageSize = this.pageSize
  },
  mounted() {
    this.getDataInfoFunction()
  },
  computed: {},
  methods: {
    //子组件更新父组件 双向绑定
    updateMsg(info){
      this.modifyInfo = info
      this.data = this.data.map(function (currentValue, index, arr) {
          if(currentValue.id == info.id){
            currentValue = info  
          }
            return currentValue
      })
      this.modifyShow = false
    },
  
     //提交审核
    dwexamineEvent() {
      let  belong = Vue.ls.get(USERINFO).belong
      let roleName = Vue.ls.get(USERINFO).roleName
      let name = Vue.ls.get(USERINFO).name
      let remark2 = belong+"-"+roleName+"-"+name+"-"+'提交审核'
      if(this.modifyInfo.length == 0){
       this.$message.error(`请编辑数据,在提交审核`)
       return
      } 
      const promise = new  Promise((resolve, reject) => {
        modifyVideo(this.modifyInfo).then((response) => {
            if (response != undefined) {
               if (response.code == 200) {          
                resolve(response)
              } else {              
                resolve(response)
              }
            }
          })  
               
        }).then((d) => {         
           this.modifyVideoStatusFunction(this.modifyInfo.id,2,1,remark2) 
        })
      
    },
  
    //审核
    modifyVideoStatusFunction(id,status,pass,remark) {
      modifyVideoStatus(id,status,pass,remark).then((response) => {
        if (response != undefined) {
          if (response.code == 200) {
            let type = 'success'
            this.$notification[type]({
              message: '温馨提示',
              description: '提交审核成功!',
              duration: 3,
            })
            this.modifyInfo =''
            this.getDataInfoFunction()
          }
        }
      })
    },
    //删除
    quxiaoEvent(id) {
      this.$confirm({
        title: '提示',
        content: '确定要删除吗?',
        onOk: () => {
          deleteVideo(id).then((response) => {
            if (response != undefined) {
              if (response.code == 200) {
                let type = 'success'
                this.$notification[type]({
                  message: '温馨提示',
                  description: '删除成功!',
                  duration: 3,
                })
                this.getDataInfoFunction()
              }
            }
          })
        },
        onCancel() {},
      })
    },
    successEvent() {
      this.getDataInfoFunction()
      this.modifyShow = false
    },
    //编辑
    modifyEvent(e) {
      this.newform = JSON.parse(JSON.stringify(e))
      this.modifyShow = true
    },
    cancelEvent() {
      this.modifyShow = false
    },
    //查询
    queryEvent() {
      this.queryParam.current = 1
      this.getDataInfoFunction()
    },
    //获取表格数据
    getDataInfoFunction() {
      this.tableLoading = true
      getStandardVideoList(this.queryParam)
        .then((response) => {
          const pagination = { ...this.pagination }
          pagination.total = response.data.total
          pagination.pageSize = this.pageSize
          this.pagination = pagination
          this.pagination.current = response.data.current
          this.data = response.data.records
          this.tableLoading = false
        })
        .catch((error) => {
          this.tableLoading = false
        })
    },
    //分页
    pageShow(pagination) {
      this.tableLoading = true
      this.queryParam.current = pagination.current
      this.queryParam.pageSize = pagination.pageSize
      getUrgeData(this.queryParam)
        .then((response) => {
          const pagination = { ...this.pagination }
          pagination.total = response.data.total
          pagination.pageSize = this.pageSize
          this.pagination = pagination
          this.pagination.current = response.data.current
          this.data = response.data.records
          this.tableLoading = false
        })
        .catch((error) => {
          this.tableLoading = false
        })
    },
  },
}
const columnstable = [
  {
    title: '项目名称',
    dataIndex: 'projectName',
    width: 100,
    align: 'center',
  },
  {
    title: '区县',
    dataIndex: 'country',
    width: 100,
    align: 'center',
  },
  {
    title: '维护的等级',
    dataIndex: 'level',
    width: 100,
    align: 'center',
  },
  {
    title: '资管编号',
    dataIndex: 'number',
    width: 100,
    align: 'center',
  },
  {
    title: '客户名称',
    dataIndex: 'customer',
    width: 100,
    align: 'center',
  },
  {
    title: '客户地址',
    dataIndex: 'customerArea',
    width: 100,
    align: 'center',
  },
  {
    title: '客户姓名',
    dataIndex: 'customerName',
    width: 100,
    align: 'center',
  },
  {
    title: '联系方式',
    dataIndex: 'customerMobile',
    width: 100,
    align: 'center',
  },
  {
    title: '业务情况',
    dataIndex: 'sceneUse',
    width: 100,
    align: 'center',
    scopedSlots: { customRender: 'sceneUse' },
  },
  {
    title: '资源变更',
    dataIndex: 'action',
    width: 100,
    align: 'center',
    scopedSlots: { customRender: 'action' },
  },
]
</script>
